<template>
	<view class="page-user">
		<view class="list">
		  <!-- 支付宝 start -->
		  <view class="item" @click="handleJump" data-url="/pages/user/wallet/alipay-bind/index">
		    <view class="flex align-center">
		      <image class="image" src="../../static/zfb.png" mode="aspectFill"></image>
		      <view class="text">绑定支付宝</view>
		    </view>
		    <view>
		      <text class="Popups_del" :class="{active:!is_ali}">{{ is_ali? aliName :'未绑定'}}</text>
		      <text class="cuIcon-right text-gray" style="font-size: 28rpx;"></text>
		    </view>
		  </view>
		  <!-- 支付宝 end -->
		  <!-- 微信 start -->
		  <view class="item" @click="handleJump" data-url="/pages/user/wallet/wechat-bind/index">
		    <view class="flex align-center">
		      <image class="image" src="../../static/wechatpay.png" mode="aspectFill"></image>
		      <view class="text">绑定微信</view>
		    </view>
		    <view>
		      <text  class="Popups_del" :class="{active:!is_wx}">{{ is_wx?wxName:'未绑定'}}</text>
		      <text class="cuIcon-right text-gray" style="font-size: 28rpx;"></text>
		    </view>
		  </view>
		  <!-- 微信 end -->
		  <!-- 银行卡 start -->
		  <!-- <view class="item" @click="handleJump" data-url="/pages/user/wallet/card-bind/index">
		    <view class="flex align-center">
		      <image class="image round" src="../../static/ye.png" mode="aspectFill"></image>
		      <view class="text">绑定银行卡</view>
		    </view>
		    <view>
		      <text class="Popups_del" :class="{active:!is_card}">{{  is_card?cardName:'未绑定'}}</text>
		      <text class="cuIcon-right text-gray" style="font-size: 28rpx;"></text>
		    </view>
		  </view> -->
		  <!-- 银行卡 end -->
		</view>
		<!-- 断网检查 -->
		<fu-notwork></fu-notwork>
	</view>
</template>

<script>
	/**
	 * @author 刘畅
	 */
	export default {
		data() {
			return {
				is_ali: false, // {Boolean} 是否绑定支付宝
				if_wx: false, // {Boolean} 是否绑定微信
				is_card: false, // {Boolean} 是否绑定银行卡
				is_ali: false, // {Boolean} 是否绑定支付宝
				is_wx: false, // {Boolean} 是否绑定微信
				is_card: false ,// 是否绑定银行卡
				wxName:'',
				aliName:'',
				cardName:'',
			};
		},
		onShow() {
			this.detail(1);
			this.detail(2);
			// this.detail(3);
		},
		methods: {
			/**
			 * @function
			 * @description 是否绑定支付宝or微信
			 * @property {Number} account_type - 【账户类型 1 微信 2 支付宝 3 银行卡。类型：tinyint(1)】
			 */
			detail(type) {
				this.$api
				  .post(global.apiUrls.getMerchantWithdrawAccount, {
				    account_type: type
				  })
				  .then(res => {
				    res = res.data;
				    if (res.code == 1) {
				      if (type == 1 && res.data.true_name != '' && res.data.qrcode != '' && res.data.account_id != '') {
				        this.is_wx = true;
				        this.wxName = res.data.true_name;
				      } else if (type == 2 && res.data.true_name != '' && res.data.qrcode != '' && res.data.account_id != '') {
				        this.is_ali = true;
				        this.aliName = res.data.true_name;
				      } else if(type == 3 && res.data.true_name != '' && res.data.account_id != '') {
				        this.is_card = true;
				        this.cardName = res.data.true_name;
				      }
				    }
				  })
				  .catch(err => {
				    console.log(err, 'get_withdraw_account');
				  });
				// let _this = this;
				// _this.$api
				// 	.post(global.apiUrls.bind_status)
				// 	.then(res => {
				// 		if (res.data.code == 1) {
				// 			console.log(res);
				// 			if (res.data.data.find(item => item == 1)) {
				// 				this.if_wx = true;
				// 			}
				// 			if (res.data.data.find(item => item == 2)) {
				// 				this.is_ali = true;
				// 			}
				// 			if (res.data.data.find(item => item == 3)) {
				// 				this.is_card = true;
				// 			}
				// 		}
				// 	})
				// 	.catch(err => {
				// 		console.log(err, 'get_withdraw_account');
				// 	});
			}
		}
	};
</script>

<style lang="scss">
	.Popups_del {
		color: $fu-type-error;
		font-size: 24rpx;
		padding-right: 10rpx;
	}

	.list {
		background: #ffffff;

		.item {
			height: 104upx;
			background: rgba(255, 255, 255, 1);
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 32rpx;
			position: relative;

			&:after {
				content: '';
				position: absolute;
				bottom: 0;
				left: 32rpx;
				right: 0;
				background: #eeeeee;
				display: block;
				height: 1px;
			}

			&:nth-last-child(1):after {
				background: none;
			}

			.image {
				width: 52rpx;
				height: 52rpx;
			}
		}

		.icon_w {
			width: 44upx;
			height: 44upx;

			svg {
				width: 44upx;
				height: 44upx;
			}
		}

		.text {
			margin-left: 16rpx;
			font-size: 32rpx;
			font-family: PingFang-SC-Regular;
			color: #333333;
		}

		.adds {
			width: 18rpx;
			height: 18rpx;
			margin: 0 20rpx;
		}

		.arrow {
			text-align: right;
			color: #000000;

			.iconfont {
				color: #666;
				font-size: 28upx;
			}
		}
	}
</style>
